<template>
  <view class="blogCard">
    <image :src="data.pic" style="width: 100%;height: 100px;border-radius: 4px 4px 0 0;"/>
    <view style="padding:  10px;">
      <text style="font-size: 12px;color: black;">{{data.title}}</text>
      <view style=" display: flex;margin-top: 6px;justify-content: space-between;align-items: center;">
        <image :src="data.icon" style="width: 24px;height: 24px;border-radius: 12px;margin-right: 4px;"/>
        <text style="font-size: 10px;color: black;flex: 1;">{{data.nickName}}</text>
        <image src="../static/images/爱心.png" style="width: 16px;height: 16px;"></image>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { toRefs, defineProps } from 'vue'
const props = defineProps({
  //子组件接收父组件传递过来的值
  data: Object,
})
</script>

<style scoped lang="css">
.blogCard{
  background-color: #fff;
  width: 100%;
  border-radius: 4px;
  margin-bottom: 10px;
}
</style>
